import React, {useEffect, useState} from "react";
import {Checkbox, Row, Col} from "antd";

function MyWeekPicker({initWeek, getWeek, index, disabled, item}) {

  const pageData =
    [
      {label: "周一", value: "1"},
      {label: "周二", value: "2"},
      {label: "周三", value: "3"},
      {label: "周四", value: "4"},
      {label: "周五", value: "5"},
      {label: "周六", value: "6"},
      {label: "周日", value: "7"},
      {label: "每天", value: "*"}
    ]
/*  console.log('initWeek', initWeek);
  console.log(`render(${index})`);*/
  return (
    <>
      <Row>
        <Checkbox.Group
          disabled={disabled}
          value={initWeek}
          style={{
            display: "grid",
            justifyContent: "space-between",
            // alignContent: "center"
            gridTemplateColumns: "repeat(4,auto)",
            gridTemplateRows: "1fr 1fr",
            justifyItems: "center",
            boxSizing: "border-box"
          }}
          options={pageData}
          onChange={(weekCron) => {
            getWeek({index, item, weekCron})
          }}/>
      </Row>
    </>
  )
}

export default React.memo(MyWeekPicker)
